<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			.container{
				height: 395.68px;
			}
			.title{
				border-bottom: 3px #DCDCDC solid;
				display:inline-block; 
				width: 200.8px;
				height: 38.2px;
				background-color:#FFFFFF;
				padding-bottom: 7px;
				padding-left: 30px;
				margin: 0 auto;
				float: left;
				color: #dc0b21;
			}
			.content1{
				width: 1140px;
				height: 58px;
				margin: 0 auto;
			}
			.picture1{
				width: 350px;
				height:200px;
				margin:0 15px;
				float: left;
				position: relative;
				
			}
			.xili{
				width: 100%;
				height: 100%;
			}
			.picture2{
				width: 350px;
				height:200px;
				margin-right: 15px;
				float: left;
				position: relative;
			}
			.jianada{
				width: 100%;
				height: 100%;
			}
			.picture3{
				width: 350px;
				height:300px;
				float: left;
				position: relative;
			}
			.xinxilan{
				width: 100%;
				height: 200px;
			}
			.picture0{
				width: 1110px;
				margin: 20px auto;
			}
			.adly{
				color: #dc0b21;
				font-size: larger;
				font-weight: 600;
			}
			.picture00{
				width: 1110px;
				margin: 10px auto;
			}
			.abc:after{
			  content:"";
			  width:350px;
			  height:200px;
			  background:rgba(0,0,0,0.5);
			  position: absolute;
			  left:0;
			  top:0;
			  display: none;
			}
			.abc:hover:after{
			   content:"";
			   width:350px;
			   height:200px;
			   background:rgba(0,0,0,0.5);
			   position: absolute;
			   left:0;
			   top:0;
			   display: block;
			}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="content1">
				<div class="content"><h2 class="title">雅思带你去哪里？</h2></div>
			</div>
			<div class="picture0">
				<div class="picture1 abc">
					<img class="xili" src="https://www.ielts.org/-/media/images/resources/sydneyoperahousewithskylines2.ashx?la=en&hash=CB1E0766A088A054D6DAFD8100C52A2E306A6074" alt="悉尼,澳大利亚" >
					<div class="adly">澳大利亚</div>
					<div class="mubiao">实现与雅思考试去澳大利亚的梦想</div>
				</div>
				<div class="picture2 abc">
					<img class="jianada" src="https://www.ielts.org/-/media/images/resources/canada-flag.ashx?la=en&hash=47FBE73783C9354E0AA516763AD1C99E3E4943BF" alt="加拿大" >
					<div class="adly">加拿大</div>
					<div class="mubiao">与雅思考试一起向加拿大敞开大门</div>
				</div>
				<div class="picture3 abc">
					<img class="xinxilan" src="https://www.ielts.org/-/media/content-blocks/new-zealand.ashx?la=en&hash=2064A98439800E652816C7B09FA3CC6D3EC30BF0" alt="新西兰" >
					<div class="adly">新西兰</div>
					<div class="mubiao">雅思考试开始您的新西兰之旅</div>
				</div>
			</div>
			<div style="clear:both">
				
			</div>
			<div class="picture00">
				<div class="picture1 abc">
					<img class="xili" src="https://www.ielts.org/-/media/images/resources/red-bus_big-ben_bridge.ashx?la=en&hash=B00D1D211D3585E8A77E0C14EA7FADC9B23135E7" alt="英国" >
					<div class="adly">英国</div>
					<div class="mubiao">与雅思考试一起在英国生活，工作和学习</div>
				</div>
				<div class="picture2 abc">
					<img class="jianada" src="https://www.ielts.org/-/media/content-blocks/03-ielts-bbp-6-3061.ashx?la=en&hash=B9D448119EE0AB60858F48A576E639AE76C167EE" alt="美国" >
					<div class="adly">美国</div>
					<div class="mubiao">在美国的生活始于雅思</div>
				</div>
				<div class="picture3 abc">
					<img class="xinxilan" src="https://www.ielts.org/-/media/content-blocks/ielts-world.ashx?la=en&hash=81C4479BDFCCA35C55780844A80D6C20C5842B46" alt="雅思世界地图" >
					<div class="adly">与雅思一起环游世界</div>
					<div class="mubiao">受到全球大学，政府和企业的信任</div>
				</div>
			</div>
		</div>
		
	</body>
</html>
